import React, { useState, useEffect } from 'react'
import { View } from '@tarojs/components'
import Taro from '@tarojs/taro'
import { AtDrawer, AtList, AtListItem, AtInput, AtButton } from 'taro-ui'
import { request } from '../../utils/request'
import { useRequest } from 'ahooks'
import styles from './index.module.less'

const pingjiaoFuc = () => {
  return request('get', '/app/pingjiao', {})
}
const bindFun = (account: string, password: string | null) => {
  return request('post', '/app/loginAction', { account, password })
}

const isBindJiaowuFunc = () => {
  return request('post', '/app/isBindJiaowu', {})
}
const BindStuNum: React.FC<{
  isShow: boolean
  onClose: () => void
}> = ({ isShow, onClose }) => {
  const [account, setAccount] = useState('')
  const [password, setPassword] = useState('')
  const bind = useRequest(bindFun, {
    manual: true,
    onSuccess: (res) => {
      // @ts-ignore
      if (res && res.code === 500) {
        Taro.showToast({
          // @ts-ignore
          title: res.message,
          icon: 'none',
          duration: 2000
        })
        return
      }
      onClose()
      Taro.showToast({
        title: '绑定成功',
        icon: 'none',
        duration: 2000
      })
    }
  })
  return (
    <View>
      <AtDrawer
        show={isShow}
        mask
        width="260px"
        onClose={onClose}
      >
        <View className={styles.User}>
          <View> <AtInput
            name="account"
            border={false}
            title='学号'
            placeholder='学号'
            value={account}
            // @ts-ignore
            onChange={(e) => setAccount(e)}
          /><AtInput
              name="password"
              border={false}
              type="password"
              title='教系密码'
              placeholder='教务密码'
              value={password}
              // @ts-ignore
              onChange={(e) => setPassword(e)}
            /></View>
        </View>
        {<AtButton type='primary' size='small' loading={bind.loading} onClick={() => bind.run(account, password)} >绑 定</AtButton >}
      </AtDrawer>
    </View>
  )
}
const WeiSchool: React.FC<{}> = () => {
  const [show, setShow] = useState(false)

  const pingjiao = useRequest(pingjiaoFuc, {
    manual: true,
    onSuccess: res => {
      Taro.showToast({
        title: String(res),
        icon: 'none'
      })
    }
  })
  const goScore = (isBaiye: boolean = false) => {
    isBindJiaowuFunc().then(res => {
      if (!res) {
        Taro.showToast({
          title: String('你还未绑定学号和教务密码，不能进行该操作'),
          icon: 'none'
        })
        return
      }

      if (isBaiye) {
        Taro.navigateTo({ url: `/pages/weiSchool/baiyeScore` })
        Taro.setNavigationBarTitle({
          title: "百叶积分"
        })
      } else {
        Taro.navigateTo({ url: `/pages/weiSchool/score` })
        Taro.setNavigationBarTitle({
          title: "我的成绩"
        })
      }
    })

  }
  const goActivityList = () => {
    isBindJiaowuFunc().then(res => {
      if (!res) {
        Taro.showToast({
          title: String('你还未绑定学号和教务密码，不能进行该操作'),
          icon: 'none'
        })
        return
      }
      Taro.navigateTo({ url: `/pages/weiSchool/activityList` })
      Taro.setNavigationBarTitle({
        title: "百叶活动"
      })
    })

  }
  const goPingjiao = () => {
    isBindJiaowuFunc().then(res => {
      if (!res) {
        Taro.showToast({
          title: String('你还未绑定学号和教务密码，不能进行该操作'),
          icon: 'none'
        })
        return
      }
      pingjiao.run()
    })
  }
  const bingdingsno = () => {
    isBindJiaowuFunc().then(res => {
      if (res) {
        Taro.showToast({
          title: String('你已经绑定学号和教务密码，若需要重新绑定，请联系管理员'),
          icon: 'none',
          duration: 3000
        })
        return
      }
      setShow(true)
    })
  }
  const goBarks = () => {
    Taro.navigateTo({
      url: '/pages/my/barks',
    })
    Taro.setNavigationBarTitle({
      title: "招聘信息"
    })
  }
  return (
    <View className={styles.school}>
      <AtList>
        <AtListItem
          title='查询个人成绩'
          arrow='right'
          onClick={() => goScore(false)}
          iconInfo={{ size: 25, color: '#78A4FA', value: 'list', }}
        />
        <AtListItem
          title='一键评教'
          arrow='right'
          onClick={goPingjiao}
          iconInfo={{ size: 25, color: '#78A4FA', value: 'bookmark', }}
        />
        <AtListItem
          title='绑定学号密码'
          arrow='right'
          onClick={bingdingsno}
          iconInfo={{ size: 25, color: '#78A4FA', value: 'alert-circle', }}
        />
        <AtListItem
          title='百叶积分'
          arrow='right'
          onClick={() => goScore(true)}
          iconInfo={{ size: 25, color: '#78A4FA', value: 'user', }}
        />
        <AtListItem
          title='百叶活动'
          arrow='right'
          onClick={goActivityList}
          iconInfo={{ size: 25, color: '#78A4FA', value: 'tags', }}
        />
        <AtListItem
          title='招聘信息'
          arrow='right'
          onClick={goBarks}
          iconInfo={{ size: 25, color: '#78A4FA', value: 'bell', }}
        />
      </AtList>
      <BindStuNum isShow={show} onClose={() => setShow(false)}></BindStuNum>
    </View>
  )
}

export default WeiSchool